<template>
    <div>
        <input type="text"  v-model="state.Mname"/>
        <input type="text" v-model="state.Mnum"/>
        <input type="button" value="查询" @click="shunSHow" />
        <table>
       <tr>
        <td>名称</td>
        <td>数量</td>
        <td>简介</td>
        <td>图片</td>
        <td>时间</td>
        <td>操作</td>
       </tr>
       <tr v-for="item in list">
        <td>{{ item.mname }}</td>
        <td>{{ item.mnum }}</td>
        <td>{{ item.mjianjie }}</td>
        <td><img :src="item.mtupian" alt="" width="50px" height="50px"/></td>
        <td>{{ item.mdatetime.substr(0,10) }}</td>
        <td>   <input type="button" value="删除" @click="shan(item.mid)" /></td>
       </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import {  reactive, onMounted,toRefs} from 'vue'
import { useRoute,useRouter} from 'vue-router'
import axios from 'axios'
const route = useRoute()
const router = useRouter()

const data:any= reactive({
    state:{
        Mname:'',
        Mnum:''
      
    },
    list:[],
    
});

const {state,list} = toRefs(data)

onMounted(()=>{
  shunSHow()
})

const shunSHow = ()=>{
    axios({
        url:'https://localhost:7006/api/Member/ShowMember',
        method:'get',
        params:state.value

    }).then((res)=>{
        console.log(res)
        list.value = res.data.data
    })
}

const shan = (mid:number)=>{
    if(confirm('确定要删除吗')){
        axios({
        url:'https://localhost:7006/api/Member/DeleteMember',
        method:'get',
        params:{Mid:mid}
    }).then((res)=>{
        console.log(res)
        if(res.data.data > 0){
            alert('删除成功')
            shunSHow()
        }else{
            alert('删除失败')
        }
        shunSHow()
    })
        
    }
  
}

</script>

<style scoped>

</style>